var span = document.getElementById("search_img");
var wrap = document.getElementsByClassName("search_wrap");
var clo = document.getElementsByClassName("close");
var kefu = document.getElementsByClassName("kefu");
var ceBian = document.getElementsByClassName("cebian_1");
var flat = false;
var delX = 0;
var delY = 0;
var box1 = document.getElementById("box1");
var box2 = document.getElementById("box2");
box1.onmousedown = function (event) {
  flat = true;
  delX = window.event.offsetX;
  delY = window.event.offsetY;
};
document.onmousemove = function (event) {
  if (flat) {
    var x = window.event.clientX - delX;
    var y = window.event.clientY - delY;
    box2.style.left = x + "px";
    box2.style.top = y + "px";
  }
};
box1.onmouseup = function () {
  flat = false;
};
var getActive = function () {
  if (wrap[0].className == "search_wrap") {
    wrap[0].className = "search_wrap active";
  } else {
    wrap[0].className = "search_wrap";
  }
};
var innerActive = function () {
  if (kefu[0].className == "kefu") kefu[0].className = "kefu active";
  if (ceBian[0].className == "cebian_1")
    ceBian[0].className = "cebian_1 active";
};
var clearActive = function () {
  if (kefu[0].className == "kefu active") kefu[0].className = "kefu";
  if (ceBian[0].className == "cebian_1 active")
    ceBian[0].className = "cebian_1";
};
span.addEventListener("click", function () {
  getActive();
});

ceBian[0].addEventListener("click", function () {
  innerActive();
});
clo[0].addEventListener("click", function () {
  clearActive();
});
